// 引入获取user和更新user的接口
import {reqGetUser , reqUpdateUser} from '../../api'

// 读取query参数指定参数名的值
function getQueryValue(name) {
  var str = location.href.split('?');
  var query = str[1];
  var vars = query.split('&');
  for (var i = 0; i < vars.length; i++) {
    var pair = vars[i].split('=');
    if (pair[0] == name) {
      return pair[1];
    }
  }
}

// 获取用户
async function getUser(){
  // 获取id参数
  const id = getQueryValue('id')
  // 请求获取对应的用户
  const result = await reqGetUser(id)
  const user = result.data


  // 将用户显示到界面上
  document.getElementById('_id').value = user._id
  document.getElementById('username').value = user.username
  document.getElementById('preview').src = 'http://localhost:8081' + user.profile


  // 实现选择图片预览效果
  document.getElementById('profile').onchange = (e) => {
    // 得到加载的文件对象
    console.log(e.target.files);
    const file = e.target.files[0]
    // 将file中包含文件编码 成base64字符串
    const fileReader = new FileReader()
    fileReader.readAsDataURL(file)
    fileReader.onload = () =>{
      const base64 = fileReader.result
      document.getElementById('preview').src = base64
    }
  }

  // 通过ajax提交更新用户的表单
  const updateForm = document.getElementById('updateForm')
  updateForm.onsubmit = async(e) =>{
    e.preventDefault()

    // 创建formData对象  收集表单输入的数据
    const formData = new FormData(updateForm)

    console.log(updateForm);
    const result = await reqUpdateUser(formData)
    console.log(result);
    if (result.code==='2000') {
      // 修改成功
      window.location = '/users.html'
    } else {
      alert(result.message)
    }
  }
}

getUser()

